<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<html>
<head>
    <meta charset="utf-8">
    <title>阿星影院在线售票</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="Author" content="larry"/>
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="format-detection" content="telephone=no">
    <%--<link rel="shortcut icon" href="${base}/assets/images/favicon.ico">--%>
    <link rel="stylesheet" type="text/css" href="${base}/static/css/login/base.css">
    <link rel="stylesheet" type="text/css" href="${base}/static/css/login/home.css">
    <link rel="stylesheet" href="${base}/assets/css/layui/layui.css">
    <meta name="lx:autopv" content="off">
    <meta name="lx:appnm" content="movie">
    <meta name="lx:category" content="movie">
    <style>
        .layui-btn-danger {
            background-color: #ff2540;
        }

        .errorMsg {
            font-size: 16px;
            color: #de3131;
        }
    </style>
</head>
<body>
<header class="aui-header">
    <div class="aui-header-box">
        <h1>
            <a href="login.page" class="aui-header-box-logo">阿星影院在线售票</a>
        </h1>
    </div>
</header>

<section class="aui-content">
    <div class="aui-content-box clearfix">
        <div class="aui-content-box-fl">
            <div class="aui-form-header">
                <div class="aui-form-header-item on">账户登录</div>
                <span class="aui-form-header-san"></span>
            </div>
            <div class="aui-form-content">
                <div class="aui-form-content-item" style="display: block;">
                    <form id="userForm" class="layui-form"
                          action="${base}/login/login.do" enctype="multipart/form-data" method="post">
                        <div class="aui-form-list">
                            <input type="text" class="aui-input" name="userName" placeholder="请输入用户名"
                                   data-required="required"
                                   autocomplete="off">
                        </div>
                        <div class="aui-form-list">
                            <input type="password" class="aui-input" name="password" placeholder="请输入密码"
                                   data-required="required" autocomplete="off">
                        </div>
                        <div class="aui-form-list">
                            <input type="text" class="aui-input" name="code" placeholder="请输入验证码"
                                   data-required="required"
                                   autocomplete="off">
                            <img id="checkCodePic" class="aui-child" src="verify.do" width="120" height="40">
                        </div>
                        <div class="aui-form-pwd clearfix">
                            <a href="#">忘记密码？</a>
                        </div>
                        <div class="errorMsg">
                            <span>${error}</span>
                        </div>
                        <div class="aui-form-btn">
                            <button class="layui-btn layui-btn-danger layui-btn-fluid"
                                    lay-submit lay-filter="login">登陆
                            </button>
                        </div>
                    </form>
                </div>
            </div>
        </div>
        <div class="aui-content-box-fr">
            <div class="aui-content-box-text">
                <h3>还没有帐号:</h3>
                <a href="register.page" class="aui-ll-link">立即注册</a>
            </div>
        </div>
    </div>
</section>

<script type="text/javascript" src="${base}/assets/js/layui/layui.js"></script>
<script>
    layui.use(['form', 'layer'], function () {
        var $ = layui.$, layer = layui.layer, form = layui.form;

        //提交表单
        form.on('submit(login)', function (data) {
            console.log(data.field);
            $.ajax({
                type: 'POST',
                url: '${base}/login/login.do',
                dataType: 'json',
                data: data.field,
                async: true,
                success: function (res) {
                    layer.msg('这里是msg内容');
                    console.log(res);
                    if (res.success) {
                        layer.msg(res.data, {icon: 1, time: 1500}, function () {
                            // location.reload();
                        });
                    } else {
                        layer.msg(res.msg, {icon: 5, time: 2000}, function () {
                            // location.reload();
                        });
                    }
                }, error: function () {
                    layer.msg("请求失败，请联系开发人员", {icon: 5, time: 2000}, function () {
                        // location.reload();
                    });
                }
            });
        });
    });
</script>
</body>
</html>